<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link rel="stylesheet" href="./wow/css/animate.css">
		<link href="./bootstrap/css/bootstrap.min.css" rel="stylesheet" />
		<script src="./bootstrap/js/bootstrap.min.js"></script>


		<title>用户注册</title>
	</head>
	<style type="text/css">
		* {
			margin: 0;
			padding: 0;
		}

		html,
		body {
			height: 100%;
			background: #C9CCD3;
			background-image: linear-gradient(-180deg, rgba(255, 255, 255, 0.50) 0%, rgba(0, 0, 0, 0.50) 100%);
			background-blend-mode: lighten;
		}

		div {
			/* border: 1px #000000 solid;  */
		}

		#header {
			position: fixed;
			top: 0px;
			height: 50px;
			text-align: center;
			width: 100%;
			margin-top: 20px;
		}

		#footer {
			height: 40px;
			position: fixed;
			bottom: 0px;
			width: 100%;
			text-align: center;
		}

		form { 
			width: 400px;
			max-width: 400px;
			/* border: 1px darkgreen solid; */
			margin: 0 auto;
			text-align: center;
			padding: 20px;
			box-shadow: 0px 0px 50px #06357A;
			border-radius: 50%;
			background-image: linear-gradient(to top, #9890e3 0%, #b1f4cf 100%);
		}

		#mainContent {
			height: 100%;
			display: flex;
			align-items: center;
		}

		.row {
			margin-bottom: 20px;
		}

		form>div.row>div:nth-child(1) {
			text-align: right;
		}
	</style>

	<body>

		<div id="header">
			多用户博客系统 
		</div>
		<div id="mainContent" class="container">
			<form action="/user/register" method="post" class="wow bounceInDown">
				<h3 style="margin-bottom: 30px;">用户注册</h3>
				<div class="row">
					<div class="col-4  ">
						用户名：
					</div>
					<div class="col-6">
						<input type="text" required="required" class="form-control" />
					</div>

				</div>
				<div class="row">
					<div class="col-4  ">
						密码：
					</div>
					<div class="col-7">
						<input type="password" required="required" class="form-control" />
					</div>

				</div>
				<div class="row">
					<div class="col-4  ">
						重复密码：
					</div>
					<div class="col-8">
						<input type="password" required="required" class="form-control" />
					</div>

				</div>
				<div class="row">
					<div class="col-4  ">
						生日：
					</div>
					<div class="col-7">
						<input type="date" required="required" class="form-control" />
					</div>

				</div>
				<div class="row">
					<div class="col-4  ">
						性别：
					</div>
					<div class="col-8">
						<input type="radio" name="sex" class="ms-4" />男
						<input type="radio" name="sex" class="ms-4" checked="checked" />女
						<input type="radio" name="sex" class="ms-4" checked="checked" />中性

					</div>

				</div>
				<div class="row">
					<div class="col-4  offset-2">
						<input type="reset" class="form-control btn btn-primary" value="重置" />
					</div>
					<div class="col-4  ">

						<input type="submit" value="提交" class="form-control btn btn-success " />
					</div>

				</div>

				<div class="row">
					<div class="col-6 offset-3">
						<a href="login2.html" style="text-decoration: none;"><button type="button" class="form-control"
							style="color: green; border: 1px #055160 solid;">已注册的用户登录</button></a>
						

					</div>
				</div>






			</form>



		</div>

		<div id="footer">
			版权申明：物联网19级
		</div>

		<script src="./wow/js/wow.min.js"></script>
		<script>
			if (!(/msie [6|7|8|9]/i.test(navigator.userAgent))) {
				new WOW().init();
			};
		</script>
	</body>
</html>
